import QtQuick
import QtQuick.Controls
import QtQuick.Dialogs
import QtMultimedia

ApplicationWindow {
    id: window
    maximumHeight: 480; maximumWidth: 702; minimumHeight: 480; minimumWidth: 702
    visible: true
    title: qsTr("选择头像")

    property int leftFree: 0;
    property int aboveFree: 0;
    property double multiple: 0.0;
    property double multiplying_power: 0.5

    Rectangle{
        id:splitLine
        x: 580
        width: 2; height: 480
        color: "black"
    }

    Label{
        x: 623; y: 12
        text: "预览图"
    }
    Label{
        id: label1
        x: 400; y: 20

        text: "拖拽红框右下角黑方块改变大小"
    }
    //设置一个预览框，再将一模一样的图片放到里面，通过改变xy实现预览功能
    Rectangle{
        id: previewFrame
        x: 590; y: 30; width: 102; height: 102;
        clip: true

        Image{
            id: previewPicture
            fillMode: Image.PreserveAspectFit // 可以选择不同的填充模式
            smooth: true // 是否平滑缩放
            width: image.paintedWidth * multiplying_power
            height:image.paintedHeight * multiplying_power
            x: (-choiceBox.x + window.leftFree) * multiplying_power
            y: (-choiceBox.y + window.aboveFree) * multiplying_power
        }
    }

    Image{
        id: image
        y: 55; x: 10; width: 560; height: 415
        fillMode: Image.PreserveAspectFit // 可以选择不同的填充模式
        smooth: true // 是否平滑缩放

        Rectangle {//使用item作为选择框
            id: choiceBox;  width: 204; height: 204
            color: "transparent"
            border.color: "red"
            border.width: 2
            MouseArea {
                id: mouseArea
                anchors.fill: parent//填充整个父区域 使得父区域的鼠标使用 能被捕捉到
                enabled: true // 允许MouseArea响应鼠标事件
                drag.target: choiceBox // 指定拖拽的目标
                cursorShape: Qt.SizeAllCursor;

                // 鼠标被按下移动时触发 onPressed鼠标被按下时触发
                onPositionChanged: {//这里处理越界操作
                    //表示绘制的图片的大小
                    window.leftFree = (image.width - image.paintedWidth) / 2
                    window.aboveFree = (image.height - image.paintedHeight) / 2

                    //左上边框
                    drag.target.x = Math.max(window.leftFree, drag.target.x)
                    drag.target.y = Math.max( window.aboveFree, drag.target.y)
                    //右下边框
                    drag.target.x = Math.min(drag.target.x, image.width - window.leftFree - drag.target.width)
                    drag.target.y = Math.min(drag.target.y, image.height - window.aboveFree - drag.target.height)
                }
            }

            Rectangle{
                id:s
                width: 6; height: 6
                x: choiceBox.width - 5
                y: choiceBox.height - 5
                color: "black"

                MouseArea{
                    id: mous
                    anchors.fill: parent//填充整个父区域 使得父区域的鼠标使用 能被捕捉到
                    enabled: true // 允许MouseArea响应鼠标事件
                    cursorShape: Qt.SizeFDiagCursor;

                    // 当鼠标移动的时候，调整矩形的大小
                    onPositionChanged: {
                        var mouse_Max = Math.max(mouseX, mouseY) / 10;
                        if (mouse_Max >= 0 && (choiceBox.x + choiceBox.width > window.leftFree + image.paintedWidth
                                               || choiceBox.y +choiceBox.height  > window.aboveFree + image.paintedHeight)){
                            return;
                        }
                        choiceBox.width = Math.max(102, choiceBox.width + mouse_Max);
                        choiceBox.height = Math.max(102, choiceBox.height + mouse_Max);
                        multiplying_power = (102 / choiceBox.width)
                    }

                }
            }
        }
    }

    Button {//本地
        id: button1
        x: 10; y: 10; width: 100; height: 40
        text: "获取本地"
        onClicked: fileDialog.open()
    }
    FileDialog {
        id: fileDialog
        nameFilters: ["Images (*.png *.jpg *.jpeg *.bmp *.gif)"]
        title: "Please choose a file"
        onAccepted: {
            var file = selectedFiles[0]
            image.source = file
            previewPicture.source = file
            tailor.url = file
        }
    }
    Button {//摄像头
        id: button3
        x: 115; y: 10; width: 100; height: 40
        text: "现在拍摄"
        onClicked: {
            var component = Qt.createComponent("MyCamera.qml");
            var win = component.createObject();
            win.closing.connect(function() {
                image.source = win.fileName
                previewPicture.source = win.fileName
                tailor.url = win.fileName
                win.destroy(); // 明确销毁对象
            })
            win.show();
        }
    }

    Label{
        x: 618; y: 145
        text: "推荐头像"
    }
    Rectangle{
        id: recommend
        x: 600; y: 162; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/dingzhen.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x + 50; y: recommend.y; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/gqyg.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x; y: recommend.y + 50; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/lili.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x + 50; y: recommend.y + 50; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/qq.png";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x + 50; y: recommend.y + 100; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/sha.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x; y: recommend.y + 100; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/shushu.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x + 50; y: recommend.y + 150; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/sunxiaochuan.jpg";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }
    Rectangle{
        x: recommend.x; y: recommend.y + 150; width: 34; height: 34;
        color: "transparent"
        property string qrc: "qrc:/headPortrait/img/head portrait/wanglaoju.png";
        MouseArea {
            anchors.fill: parent
            onClicked: {
                previewPicture.source = parent.qrc
                image.source = parent.qrc
                tailor.url = parent.qrc
            }
        }
        Image {
            width: 34; height: 34;
            source: parent.qrc
            fillMode: Image.PreserveAspectFit
            smooth: true // 是否平滑缩放
        }
    }

    Button {//确定
        id: button2
        x: 590; y: 430; width: 100; height: 40
        text: "确定"
        onClicked: {
            if (image.source == ""){
                return
            }
            tailor.coordinates(image.paintedWidth, choiceBox.x - window.leftFree, choiceBox.y - window.aboveFree, choiceBox.width, choiceBox.height)
            tailor.qmlClose()
        }
    }

    onVisibleChanged: {
            if (!visible) {
                tailor.qmlClose()
            }
        }
}
